<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org" >
<head>
    <!--th:text="${video.title}"-->
    <title ></title>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="Forward Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
    <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
    <link href="/css/style.css" rel="stylesheet" type="text/css" media="all" />
    <link href="/css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
    <!-- js -->
    <script src="/js/jquery.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
    <!-- js -->
    <!-- start-smoth-scrolling -->
    <script type="text/javascript" src="/js/move-top.js"></script>
    <script type="text/javascript" src="/js/easing.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function($) {
            $(".scroll").click(function(event){
                event.preventDefault();
                $('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
            });
        });
    </script>
    <!-- start-smoth-scrolling -->
</head>
<body>
<!--&lt;!&ndash;头部&ndash;&gt;-->
<!--<div id="internationalHeader" class="international-header report-wrap-module">-->
    <!--<div class="mini-header m-header mini-type">-->
        <!--<div class="mini-header__content mini-header&#45;&#45;login">-->
            <!--<div class="nav-link">-->
                <!--<ul class="nav-link-ul mini">-->
                    <!--<li class="nav-link-item"><span><div role="tooltip" id="van-popover-6249" aria-hidden="true"-->
                                                         <!--class="van-popover van-popper popover-channe" tabindex="0"-->
                                                         <!--style="display: none;">&lt;!&ndash;&ndash;&gt; </div> <img-->
                            <!--href="https://www.bilibili.com/" class="link van-popover__reference"-->
                            <!--aria-describedby="van-popover-6249" tabindex="0">-->
                        <!--&lt;!&ndash;<i class="bilifont bili-Navbar_logo"></i>&ndash;&gt;-->
                        <!--<a href="https://www.bilibili.com/"><img src="/logo/wz.png" height="35" width="140" >-->
          <!--主站</a>-->
                        <!--</a></span></li>-->
                    <!--<li class="nav-link-item"><a href="https://www.bilibili.com/anime/" target="_blank"-->
                                                 <!--class="link">番剧</a></li>-->
                    <!--<li class="nav-link-item"><span><div role="tooltip" id="van-popover-2356" aria-hidden="true"-->
                                                         <!--class="van-popover van-popper popover-game" tabindex="0"-->
                                                         <!--style="display: none;">&lt;!&ndash;&ndash;&gt; </div> <a-->
                            <!--href="https://game.bilibili.com/" target="_blank" class="link van-popover__reference"-->
                            <!--aria-describedby="van-popover-2356" tabindex="0">游戏中心</a></span></li>-->
                    <!--<li class="nav-link-item"><span><div role="tooltip" id="van-popover-8029" aria-hidden="true"-->
                                                         <!--class="van-popover van-popper popover-live" tabindex="0"-->
                                                         <!--style="display: none;">&lt;!&ndash;&ndash;&gt; </div> <a-->
                            <!--href="https://live.bilibili.com/" target="_blank" class="link van-popover__reference"-->
                            <!--aria-describedby="van-popover-8029" tabindex="0">直播</a></span></li>-->
                    <!--<li class="nav-link-item"><a href="https://show.bilibili.com/platform/home.html?msource=pc_web"-->
                                                 <!--target="_blank" class="link">会员购</a></li>-->
                    <!--<li class="nav-link-item"><span><div role="tooltip" id="van-popover-6153" aria-hidden="true"-->
                                                         <!--class="van-popover van-popper popover-manga" tabindex="0"-->
                                                         <!--style="display: none;">&lt;!&ndash;&ndash;&gt; </div> <a-->
                            <!--href="https://manga.bilibili.com/?from=bill_top_mnav" target="_blank"-->
                            <!--class="link van-popover__reference" aria-describedby="van-popover-6153" tabindex="0">漫画</a></span>-->
                    <!--</li>-->
                    <!--<li class="nav-link-item"><a href="https://www.bilibili.com/v/game/match/" target="_blank"-->
                                                 <!--class="link">赛事</a></li>&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;-->
                    <!--<li class="nav-link-item"><span><div role="tooltip" id="van-popover-6716" aria-hidden="true"-->
                                                         <!--class="van-popover van-popper popover-app-download"-->
                                                         <!--tabindex="0" style="display: none;">&lt;!&ndash;&ndash;&gt; </div> <a-->
                            <!--href="https://app.bilibili.com/" target="_blank" class="link van-popover__reference"-->
                            <!--aria-describedby="van-popover-6716" tabindex="0"><i-->
                            <!--class="bilifont bili-icon_dingdao_xiazaiapp"></i>下载APP</a></span></li>-->
                <!--</ul>-->
            <!--</div>-->
            <!--<div class="nav-search-box">-->
                <!--<div class="nav-search">-->
                    <!--<form id="nav_searchform"><input type="text" autocomplete="off" accesskey="s" x-webkit-speech=""-->
                                                     <!--x-webkit-grammar="builtin:translate" placeholder="谁说男生不能化妆？"-->
                                                     <!--class="nav-search-keyword">-->
                        <!--<div class="nav-search-btn">-->
                            <!--<button type="button" class="bilifont bili-icon_dingdao_sousuo nav-search-submit"></button>-->
                        <!--</div>-->
                    <!--</form>&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;</div>-->
            <!--</div>-->
            <!--<div class="nav-user-center">-->
                <!--<div class="user-con search-icon"><a href="https://search.bilibili.com/" target="_blank"><i-->
                        <!--class="bilifont bili-icon_dingdao_sousuo"></i></a></div>-->
                <!--<div class="user-con signin">-->
                    <!--<div data-v-7230af51="" class="item"><span data-v-7230af51=""><div role="tooltip"-->
                                                                                       <!--id="van-popover-4833"-->
                                                                                       <!--aria-hidden="true"-->
                                                                                       <!--class="van-popover van-popper van-popper-nav van-popper-avatar"-->
                                                                                       <!--tabindex="0"-->
                                                                                       <!--style="width: 280px; display: none;">&lt;!&ndash;&ndash;&gt; <div-->
                            <!--data-v-7230af51="" class="vp-container"><a data-v-7230af51=""-->
                                                                       <!--href="https://space.bilibili.com/"-->
                                                                       <!--target="_blank" class="avatar"><div-->
                            <!--data-v-7230af51="" class="avatar-decorate-empty"></div><img data-v-7230af51=""-->
                                                                                        <!--src=""-->
                                                                                        <!--alt="" class="avatar-img"><svg-->
                            <!--data-v-7230af51="" aria-hidden="true" class="svg-icon vip-icon"><use data-v-7230af51=""-->
                                                                                                 <!--xlink:href="#bili-ic_gerenzhongxin_dahuiyuanhuibiao"></use></svg></a><p-->
                            <!--data-v-7230af51="" class="nickname nickname&#45;&#45;" style="padding-top: 42px;">隐身了-看不见了呢-&#45;&#45;</p><a-->
                            <!--data-v-7230af51="" href="https://account.bilibili.com/account/big" target="_blank"-->
                            <!--class="vip">萌会员</a><div data-v-7230af51="" class="level-content"><div data-v-7230af51=""-->
                                                                                                  <!--class="level-info"><span-->
                            <!--data-v-7230af51="" class="grade">等级 2</span><span data-v-7230af51="" class="progress">-->
            <!--1325 / 1500-->
          <!--</span></div><a data-v-7230af51="" href="https://account.bilibili.com/account/record?type=exp" target="_blank"-->
                          <!--class="level-link"><div data-v-7230af51="" class="level-bar"><div data-v-7230af51=""-->
                                                                                            <!--class="level-progress"-->
                                                                                            <!--style="width: 88%;"></div></div></a><div-->
                            <!--data-v-7230af51="" class="level-intro"><p data-v-7230af51="" class="level-intro__title">作为LV2-->
            <!--，你可以：-->
            <!--</p><div data-v-7230af51="" class="level-intro__content">1、发射个性弹幕（彩色、高级）<br>2、参与视频互动（评论）<br>3、投稿成为偶像</div><a-->
                            <!--data-v-7230af51=""-->
                            <!--href="https://www.bilibili.com/blackboard/help.html#%E4%BC%9A%E5%91%98%E7%AD%89%E7%BA%A7%E7%9B%B8%E5%85%B3?id=7251c4ab69d44a8ebbbd276dea46d790"-->
                            <!--target="_blank" class="level-intro__link">会员等级相关说明-->
            <!--<svg data-v-7230af51="" aria-hidden="true" class="svg-icon"><use data-v-7230af51=""-->
                                                                             <!--xlink:href="#bili-icon_caozuo_xiangyou"></use></svg></a></div></div><div-->
                            <!--data-v-7230af51="" class="coins"><div data-v-7230af51="" class="coins-container"><div-->
                            <!--data-v-7230af51="" class="info"><svg data-v-7230af51="" aria-hidden="true"-->
                                                                 <!--class="add-one-icon"><use data-v-7230af51=""-->
                                                                                           <!--xlink:href="#bili-yingbi"></use></svg><a-->
                            <!--data-v-7230af51="" href="https://account.bilibili.com/site/coin" target="_blank" title="硬币"-->
                            <!--class="jump"><svg data-v-7230af51="" aria-hidden="true" class="coins-icon"><use-->
                            <!--data-v-7230af51="" xlink:href="#bili-icon_dingdao_yingbi"></use></svg><span-->
                            <!--data-v-7230af51="" class="money">1.0</span></a><span data-v-7230af51="" class="login-award">登录奖励</span><a-->
                            <!--data-v-7230af51="" href="https://pay.bilibili.com/paywallet-fe/bb_balance.html"-->
                            <!--target="_blank" title="B币"><svg data-v-7230af51="" aria-hidden="true" class="coins-icon"><use-->
                            <!--data-v-7230af51="" xlink:href="#bili-icon_dingdao_Bbi"></use></svg><span data-v-7230af51=""-->
                                                                                                     <!--class="money">0</span></a></div><div-->
                            <!--data-v-7230af51="" class="contact"><a data-v-7230af51=""-->
                                                                  <!--href="https://passport.bilibili.com/account/security#/bindmail"-->
                                                                  <!--target="_blank" class="email"><i data-v-7230af51=""-->
                                                                                                   <!--class="bilifont email-icon email-icon&#45;&#45;bind"></i>-->
                        <!--&lt;!&ndash;&ndash;&gt;<span data-v-7230af51="" class="contact-tips email-tips">已绑定</span></a><a-->
                            <!--data-v-7230af51="" href="https://passport.bilibili.com/account/security#/bindphone"-->
                            <!--target="_blank" class="phone"><i data-v-7230af51=""-->
                                                             <!--class="bilifont phone-icon phone-icon&#45;&#45;bind"></i>-->
                        <!--&lt;!&ndash;&ndash;&gt;<span data-v-7230af51="" class="contact-tips phone-tips">已绑定</span></a></div></div>-->
                        <!--&lt;!&ndash;&ndash;&gt;</div><div data-v-7230af51="" class="counts"><a data-v-7230af51=""-->
                                                                               <!--href="https://space.bilibili.com/384428571/fans/follow"-->
                                                                               <!--target="_blank" class="count-item"><div-->
                            <!--data-v-7230af51="" class="item-key">关注</div><div data-v-7230af51="" class="item-value"><span-->
                            <!--data-v-7230af51="" class="item-num">&#45;&#45;</span><span data-v-7230af51=""-->
                                                                               <!--class="item-unit"></span></div></a><a-->
                            <!--data-v-7230af51="" href="https://space.bilibili.com/384428571/fans/fans" target="_blank"-->
                            <!--class="count-item"><div data-v-7230af51="" class="item-key">粉丝</div><div data-v-7230af51=""-->
                                                                                                     <!--class="item-value"><span-->
                            <!--data-v-7230af51="" class="item-num">&#45;&#45;</span><span data-v-7230af51=""-->
                                                                               <!--class="item-unit"></span></div></a><a-->
                            <!--data-v-7230af51="" href="https://space.bilibili.com/384428571/dynamic" target="_blank"-->
                            <!--class="count-item"><div data-v-7230af51="" class="item-key">动态</div><div data-v-7230af51=""-->
                                                                                                     <!--class="item-value"><span-->
                            <!--data-v-7230af51="" class="item-num">&#45;&#45;</span><span data-v-7230af51=""-->
                                                                               <!--class="item-unit"></span></div></a></div><div-->
                            <!--data-v-7230af51="" class="links"><a data-v-7230af51=""-->
                                                                <!--href="https://account.bilibili.com/account/home"-->
                                                                <!--target="_blank" class="link-item"><div-->
                            <!--data-v-7230af51="" class="link-title"><i data-v-7230af51=""-->
                                                                     <!--class="link-icon bilifont bili-icon_dingdao_gerenzhongxin"></i>-->
            <!--个人中心-->
          <!--</div></a><a data-v-7230af51="" href="https://member.bilibili.com/v2#/upload-manager/article" target="_blank"-->
                       <!--class="link-item"><div data-v-7230af51="" class="link-title"><i data-v-7230af51=""-->
                                                                                       <!--class="link-icon bilifont bili-icon_dingdao_tougaoguanli"></i>-->
            <!--投稿管理-->
          <!--</div></a><a data-v-7230af51="" href="https://pay.bilibili.com/" target="_blank" class="link-item"><div-->
                            <!--data-v-7230af51="" class="link-title"><i data-v-7230af51=""-->
                                                                     <!--class="link-icon bilifont bili-icon_dingdao_qianbao"></i>-->
            <!--B币钱包-->
          <!--</div></a><a data-v-7230af51="" href="https://show.bilibili.com/orderlist" target="_blank" class="link-item"><div-->
                            <!--data-v-7230af51="" class="link-title"><i data-v-7230af51=""-->
                                                                     <!--class="link-icon bilifont bili-icon_dingdao_dingdanzhongxin"></i>-->
            <!--订单中心-->
          <!--</div></a><a data-v-7230af51="" href="https://link.bilibili.com/p/center/index" target="_blank"-->
                       <!--class="link-item"><div data-v-7230af51="" class="link-title"><i data-v-7230af51=""-->
                                                                                       <!--class="link-icon bilifont bili-icon_dingdao_zhibozhongxin"></i>-->
            <!--直播中心-->
          <!--</div></a><a data-v-7230af51="" href="https://www.bilibili.com/v/cheese/mine" target="_blank"-->
                       <!--class="link-item"><div data-v-7230af51="" class="link-title"><i data-v-7230af51=""-->
                                                                                       <!--class="link-icon bilifont bili-icon_dingdao_cheese"></i>-->
            <!--我的课程-->
          <!--</div></a></div>&lt;!&ndash;&ndash;&gt;<div data-v-7230af51="" class="logout"><a data-v-7230af51=""-->
                                                                           <!--href="https://account.bilibili.com/login?act=exit"><i-->
                            <!--data-v-7230af51="" class="link-icon bilifont bili-icon_dingdao_dengchu"></i>-->
          <!--退出-->
        <!--</a></div></div></div> <div data-v-7230af51="" class="mini-avatar van-popover__reference"-->
                                    <!--aria-describedby="van-popover-4833" tabindex="0"><img data-v-7230af51=""-->
                                                                                          <!--src="局长 - 搜索结果 终极版/7f76ba6d73865288109b372b76a0b0bdf6769e6c.jpg@52w_53h_1c_100q.webp"-->
                                                                                          <!--alt="" class=""></div></span>-->
                    <!--</div>-->
                    <!--<div data-v-6d30f0e8="" class="item"><span data-v-6d30f0e8=""><div role="tooltip"-->
                                                                                       <!--id="van-popover-4290"-->
                                                                                       <!--aria-hidden="true"-->
                                                                                       <!--class="van-popover van-popper van-popper-vip"-->
                                                                                       <!--tabindex="0"-->
                                                                                       <!--style="width: 260px; display: none;">&lt;!&ndash;&ndash;&gt; </div> <div-->
                            <!--data-v-6d30f0e8="" class="mini-vip van-popover__reference"-->
                            <!--aria-describedby="van-popover-4290" tabindex="0">&lt;!&ndash;&ndash;&gt;<span data-v-6d30f0e8=""-->
                                                                                          <!--target="_blank" class="name">-->
      <!--大会员</span></div></span></div>-->
                    <!--<div data-v-cba1b22a="" class="item">-->
                        <!--<div data-v-7adc35f6="" data-v-cba1b22a="" class="nav-item">-->
                            <!--<div data-v-7adc35f6="" class="t">&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;<a data-v-cba1b22a="" data-v-7adc35f6=""-->
                                                                               <!--href="https://message.bilibili.com/new"-->
                                                                               <!--target="_blank"><span data-v-cba1b22a=""-->
                                                                                                     <!--data-v-7adc35f6=""-->
                                                                                                     <!--class="name">消息</span></a>-->
                            <!--</div>&lt;!&ndash;&ndash;&gt;-->
                            <!--<div data-v-7adc35f6="" class="i-frame" style="display: none;">-->
                                <!--<iframe data-v-7adc35f6="" src="/局长 - 搜索结果 终极版/index_new_pc_sync.html"-->
                                        <!--frameborder="0" width="100%" height="100%"></iframe>-->
                            <!--</div>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div data-v-7fd0073e="" class="item">-->
                        <!--<div data-v-73e9d354="" data-v-7fd0073e="" class="nav-item">-->
                            <!--<div data-v-73e9d354="" class="t">&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;<a data-v-7fd0073e="" data-v-73e9d354=""-->
                                                                               <!--href="https://t.bilibili.com/"-->
                                                                               <!--target="_blank"><span data-v-7fd0073e=""-->
                                                                                                     <!--data-v-73e9d354=""-->
                                                                                                     <!--class="name">动态</span></a>-->
                            <!--</div>&lt;!&ndash;&ndash;&gt;</div>-->
                    <!--</div>-->
                    <!--<div data-v-59fb22a8="" class="item"><span data-v-59fb22a8=""><div role="tooltip"-->
                                                                                       <!--id="van-popover-7707"-->
                                                                                       <!--aria-hidden="true"-->
                                                                                       <!--class="van-popover van-popper van-popper-favorite"-->
                                                                                       <!--tabindex="0"-->
                                                                                       <!--style="width: 520px; display: none;">&lt;!&ndash;&ndash;&gt; <div-->
                            <!--data-v-59fb22a8="" class="vp-container"><div data-v-59fb22a8=""-->
                                                                         <!--class="tabs-panel">&lt;!&ndash;&ndash;&gt;</div>-->
                        <!--&lt;!&ndash;&ndash;&gt;</div></div> <div data-v-59fb22a8="" class="mini-favorite van-popover__reference"-->
                                                 <!--aria-describedby="van-popover-7707" tabindex="0"><span-->
                            <!--data-v-59fb22a8=""><span data-v-59fb22a8="" class="name">收藏</span>-->
                        <!--&lt;!&ndash;&ndash;&gt;</span></div></span></div>-->
                    <!--<div data-v-ff0e1236="" class="item"><span data-v-ff0e1236=""><div role="tooltip"-->
                                                                                       <!--id="van-popover-77"-->
                                                                                       <!--aria-hidden="true"-->
                                                                                       <!--class="van-popover van-popper van-popper-history"-->
                                                                                       <!--tabindex="0"-->
                                                                                       <!--style="width: 370px; display: none;">&lt;!&ndash;&ndash;&gt; <div-->
                            <!--data-v-ff0e1236="" class="vp-container"><div data-v-ff0e1236="" class="tab-header"><div-->
                            <!--data-v-ff0e1236="" class="tab-item tab-item&#45;&#45;active">视频历史</div><div data-v-ff0e1236=""-->
                                                                                                <!--class="tab-item">专栏</div></div><div-->
                            <!--data-v-ff0e1236="" class="panel">&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;</div></div></div> <div data-v-ff0e1236=""-->
                                                                                                   <!--class="mini-history van-popover__reference"-->
                                                                                                   <!--aria-describedby="van-popover-77"-->
                                                                                                   <!--tabindex="0"><span-->
                            <!--data-v-ff0e1236=""><span data-v-ff0e1236="" class="name">历史</span></span></div></span></div>-->
                    <!--<div class="item"><a href="https://member.bilibili.com/v2#/home" target="_blank"><span class="name">创作中心</span></a>-->
                    <!--</div>-->
                <!--</div>&lt;!&ndash;&ndash;&gt;-->
                <!--<div data-v-37c6f684=""><span data-v-37c6f684=""><div role="tooltip" id="van-popover-2566"-->
                                                                      <!--aria-hidden="true"-->
                                                                      <!--class="van-popover van-popper van-popper-upload"-->
                                                                      <!--tabindex="0" style="width: 304px; display: none;">&lt;!&ndash;&ndash;&gt; <div-->
                        <!--data-v-37c6f684="" class="vp-container"><a data-v-37c6f684=""-->
                                                                   <!--href="https://member.bilibili.com/v2#/upload/text/apply"-->
                                                                   <!--target="_blank" class="upload-item"><i-->
                        <!--data-v-37c6f684="" class="bilifont bili-icon_dingdao_wenzhangtougao"></i><span-->
                        <!--data-v-37c6f684="" class="item-title">专栏投稿</span></a><a data-v-37c6f684=""-->
                                                                                <!--href="https://member.bilibili.com/v2#/upload/audio"-->
                                                                                <!--target="_blank" class="upload-item"><i-->
                        <!--data-v-37c6f684="" class="bilifont bili-icon_dingdao_yinpintougao"></i><span data-v-37c6f684=""-->
                                                                                                     <!--class="item-title">音频投稿</span></a><a-->
                        <!--data-v-37c6f684="" href="https://member.bilibili.com/v2#/upload/video/frame" target="_blank"-->
                        <!--class="upload-item"><i data-v-37c6f684=""-->
                                               <!--class="bilifont bili-icon_dingdao_shipintougao"></i><span-->
                        <!--data-v-37c6f684="" class="item-title">视频投稿</span></a><a data-v-37c6f684=""-->
                                                                                <!--href="https://member.bilibili.com/v2#/upload-manager/article"-->
                                                                                <!--target="_blank" class="upload-item"><i-->
                        <!--data-v-37c6f684="" class="bilifont bili-icon_dingdao_tougaoguanli1"></i><span data-v-37c6f684=""-->
                                                                                                      <!--class="item-title">投稿管理</span></a></div></div> <span-->
                        <!--data-v-37c6f684="" class="mini-upload van-popover__reference"-->
                        <!--aria-describedby="van-popover-2566" tabindex="0">-->
      <!--投稿-->
    <!--</span></span></div>-->
            <!--</div>-->
        <!--</div>-->
    <!--</div>&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;</div>-->
<!-- //header -->
<!-- gallery -->
<div id="app" class="gallery">
    <!-- Page Starts Here -->
    <div class="content">
        <div class="container">
            <div class="gallery">
                <h3>{{video.title}}</h3>
                <h5>{{video.category1Name}}-{{video.category2Name}}</h5>   <h5>{{time}}</h5>

                <video width="1080" height="480" controls="controls" autoplay loop>
                    <!--<source :src="video.videoUrl" type="video/mp4">-->
                    <source src="http://192.168.145.132:8080/group1/M00/00/00/wKiRhF4I06aAAQZdCqvCK6izJ_o728.mp4" type="video/mp4">
                </video>
                <div class="gallery-top">
                    <div id="danmu">

                    </div>
                    <div class="gallery">
                        <i class="el-icon-check">{{video.likeCount}}</i>
                        <i class="el-icon-star-on">{{video.collectCount}}</i>
                        <i class="el-icon-question">投币:{{video.playCount}}</i>
                        <i class="el-icon-share">{{video.transpoundCount}}</i>
                    </div>
                    <div class="clearfix"></div>
                    <el-row v-for="item in div">
                        <el-button type="warning" plain>{{item}}</el-button>
                    </el-row>
                    <div class="view view-tenth" style="height: 600px;width: 500px">
                        <div class="mask" style="height: 600px;width: 600px">
                            <span>时间</span><span>&nbsp; 弹幕内容</span><span>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; 发送时间</span>
                            <ul v-for="item in barrage">
                                <span >{{item.time}}&nbsp; </span>
                                <span style="color: red">{{item.content}}</span>
                                <span>&nbsp; &nbsp;&nbsp; &nbsp;{{item.format}}</span></br>
                            </ul>
                        </div>
                    </div>
                    <div class="view view-tenth" style="height: 600px;width: 500px">
                        <div class="mask" style="height: 600px;width: 600px">

                           <ul v-for="item in comment">

                               <span style="color: yellow">用户名:{{item.userId}}</span></br>
                               <span style="color: red">内容:{{item.content}}</span></br>
                               <span>{{item.format}}</span>
                               <i class="el-icon-sort-up"></i>
                               <span>{{item.likeCount}}</span>
                               <i class="el-icon-sort-down"></i>
                               <span>{{item.unlikeCount}}</span>
                           </ul>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <!-- Page Ends Here -->
</div>
<!-- //gallery -->
<!-- footer -->
<div class="footer">
    <!-- container -->
    <div class="container">
        <div class="footer-top">
            <div class="footer-grids">
                <div class="col-md-3 f-address">
                    <h5>Address</h5>
                    <ul>
                        <li>756 gt globel Place,</li>
                        <li>CD-Road,M 07 435.</li>
                        <li>Telephone: +1 234 567 9871</li>
                        <li>FAX: +1 234 567 9871</li>
                        <li>E-mail : <a href="mailto:example@email.com">Example@mail.com</a></li>
                    </ul>
                </div>
                <div class="col-md-6 f-address f-contact">
                    <h5>Stay in Touch</h5>
                    <form>
                        <input type="text" placeholder="Email address" required="">
                        <input type="submit" value="Subscribe">
                    </form>
                </div>
                <div class="col-md-3 footer-logo">
                    <a href="index.html">Forward</a>
                    <div class="footer-left">
                        <ul>
                            <li><a class="facebook" href="#"></a></li>
                            <li><a class="twitter" href="#"></a></li>
                            <li><a class="linked-in" href="#"></a></li>
                            <li><a class="you-tube" href="#"></a></li>
                        </ul>
                    </div>
                </div>
                <div class="clearfix"> </div>
            </div>
            <div class="footer-bottom">
                <div class="copyright">
                    <p>Copyright &copy; 2015.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
                </div>
                <div class="clearfix"> </div>
            </div>
        </div>
    </div>
    <!-- //container -->
</div>
<!-- //footer -->
<script type="text/javascript">
    $(document).ready(function() {
        /*
        var defaults = {
              containerID: 'toTop', // fading element id
            containerHoverID: 'toTopHover', // fading element hover id
            scrollSpeed: 1200,
            easingType: 'linear'
         };
        */

        $().UItoTop({ easingType: 'easeOutQuart' });

    });
</script>
<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
<!-- content-Get-in-touch -->
<!-- 引入组件库 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.8/dist/vue.js"></script>
<script src="https://cdn.bootcss.com/element-ui/2.5.4/index.js"></script>
<script src="/js/axios.js"></script>
<script>
    var app = new Vue({
        el: '#app',
        data:{
            time: '2020-1-1 12:00:29',
            video: {"title":"我的标题","content":"我的视频也是收到","likeCount":12,"clickCount":23,"playCount":200,
                "barrageCount":199,"insertCoinsCount":566,"collectCount":366,"transpoundCount":25,"commentCount":55,
                "category1Name":"生活","category2Name":"搞笑","updateTimeVue":"2020-1-1 12:00:29"},
            div: ['动漫','同人','搞笑'],
            barrage: [{"time":"1:23","barrageTime":"12-31 20:03","content":"我的第一弹幕"},{"time":"1:23","barrageTime":"12-31 20:03","content":"我的第一弹幕"}],
            comment: [{"content":"评论zxczxczxczxcz11","likeCount":"23","unlikeCount":"1","nikeName":"paul","url":"/images/7.jpg","commentTime":"2019-1-1"},
                {"content":"一直觉得泊进之介是人类太好了 他不像前辈贵为天神","likeCount":"23","unlikeCount":"1","nikeName":"paul","url":"/images/7.jpg","commentTime":"2019-1-1"}
            ]
        },
        methods:{
            load:function () {
                axios.get("/api/video/[[${videoId}]]").then((resp)=>{
                    app.video = resp.data.data;
                    app.div = resp.data.data.list;
                    // app.$set("video",resp.data.data);
                });

            },
            loadBarrage:function () {
                axios.get("/api/barrage/video/web/[[${videoId}]]").then((resp)=>{
                    app.barrage = resp.data.data;
                })

            },
            loadComment:function () {
                axios.get("/api/comment/video/[[${videoId}]]").then((resp)=>{
                    app.comment = resp.data.data;
                })

            }
        },
        created:function () {
            this.load();
            this.loadComment();
            this.loadBarrage();
        }

    });
</script>
</body>
</html>
